<header ui-dragdrop:desktop>
    <h2>
        <a ui-bind:href="srcUrl" target="_blank">一个旋转的3D彩色骰子</a>
    </h2>
    <div class="win-btns">
        <button class="close" ui-on:click.stop="$closeDialog">关闭</button>
    </div>
</header>
<div class="content colorful-dice" ref="mycontent">
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
    </ul>
</div>
<style>
    @keyframes rotate_animation {
        0% {
            transform: rotateY(0) rotateX(360deg);
        }

        16.7% {
            transform: rotateY(60deg) rotateX(300deg);
        }

        33.3% {
            transform: rotateY(100deg) rotateX(240deg);
        }

        50% {
            transform: rotateY(180deg) rotateX(100deg);
        }

        66.7% {
            transform: rotateY(240deg) rotateX(120deg);
        }

        83.3% {
            transform: rotateY(330deg) rotateX(60deg);
        }

        100% {
            transform: rotateY(360deg) rotateX(0deg);
        }
    }
</style>